import 'package:flutter/material.dart';

void main() => runApp(MyApp());

// 容器组件将装饰、大小限制、位置等属性融为一体
// Container两种决定大小的方式：不设置width、height根据子组件决定大小或者设置宽高；扩展大小，不设置child、宽高等
class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: Scaffold(
          appBar: AppBar(
            title: Text(''),
          ),
          body: ContainerAlignmentTest()
          // Container基本用法
          //ContainerBasicContent(),
          ),
    );
  }
}

class ContainerBasicContent extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Container(
      child: Text(
        'Hello Flutter',
        textDirection: TextDirection.ltr,
        //字体大小变为原来的1.2倍
        textScaleFactor: 1.2,
        style: TextStyle(
          color: Colors.blue,
          fontSize: 20,
          //字体粗细
          fontWeight: FontWeight.w800,
          //倾斜
          fontStyle: FontStyle.italic,
          //文字装饰 下划线
          decoration: TextDecoration.underline,
          decorationColor: Colors.pink,
          //装饰线为虚线
          decorationStyle: TextDecorationStyle.dashed,
        ),
      ),
      //子元素对齐方式 右下
      alignment: Alignment.bottomRight,
      //变换属性(平移、旋转)
      //沿Z轴旋转
      transform: Matrix4.rotationZ(0.3),
      //宽高属性
      width: 300,
      height: 300,
      //padding margin
      padding: EdgeInsets.all(12),
      margin: EdgeInsets.all(10),
      //装饰：边框、背景
      decoration: buildImageBoxDecoration(),
      // buildBoxDecoration(),
    );
  }
}

BoxDecoration buildImageBoxDecoration() {
  return BoxDecoration(
      image: DecorationImage(
          image: NetworkImage(
            "https://www.baidu.com/img/PCtm_d9c8750bed0b3c7d089fa7d55720d6cf.png",
          ),
          fit: BoxFit.cover,
          repeat: ImageRepeat.repeat));
}

BoxDecoration buildBoxDecoration() {
  return BoxDecoration(
      color: Colors.yellow,
      border: Border.all(
        color: Colors.red,
        width: 2,
      ),
      //边框弧度指定为宽度一半，变为圆
      borderRadius: BorderRadius.all(Radius.circular(4)),
      // 添加阴影
      boxShadow: [
        BoxShadow(
            color: Colors.orange,
            offset: Offset(10, 10),
            spreadRadius: 5,
            blurRadius: 10)
      ]);
}

class ContainerAlignmentTest extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Container(
      width: 200,
      height: 200,
      color: Colors.red,
      // 声明alignment后会在Container里嵌套Align组件，然后再嵌套Text组件
      // Align默认占满外层Container，Align布局子控件默认居中
      alignment: Alignment.center,
      child: Text(
        'Container',
        style: TextStyle(fontSize: 22, color: Colors.white),
      ),
    );
  }
}
